import Taro, { Component } from '@tarojs/taro'
import { Image, Swiper, SwiperItem } from '@tarojs/components'
import { toAnyPage } from '@/utils/page_router'

interface IProps {
  list: any
  radius: number
  margin: number
  padding: number
}


/**
 * 轮播图
 * @param list 数据列表
 * @param autoplay 是否自动切换
 * @param interval 自动切换时间间隔
 */
export default class Index extends Component<IProps, {}> {
  props: any
  render() {
    const {
      list=[],
      margin=0,
      padding=0,
      radius=0,
      autoplay=false,
      interval=5000
    } = this.props
    const info = list.length && list.reduce((a , b) => (b.h > a.h ? b : a))
    return (<Swiper circular autoplay={autoplay && list.length > 1} interval={interval} className='custom-ad-one' style={{height: `${info.h}rpx`}} nextMargin={`${margin}rpx`} previousMargin={`${margin}rpx`}>
      {list.map((ad, k) => {
        return (<SwiperItem key={k} className='ad-item' style={{padding: `0 ${padding}rpx;`}} onClick={() => toAnyPage(ad.url)}>
          <Image src={ad.pic} className='ad-img' style={{borderRadius: `${radius}rpx;`}}/>
        </SwiperItem>)
      })}
    </Swiper>)
  }
}
